<template>
  <div>
    <el-table v-loading="loading" :data="list" border fit highlight-current-row>
      <el-table-column align="center" width="120px" label="名称">
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="140px" label="学号">
        <template slot-scope="scope">
          <span>{{ scope.row.learn_number }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="120px" label="年级">
        <template slot-scope="scope">
          <span>{{ scope.row.grade }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="auto" label="加入时间">
        <template slot-scope="scope">
          <span>{{ scope.row.createdAt | parseTime('{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
    </el-table>
<!--    <pagination v-show="total>0" :total="total" :page.sync="query.page" :limit.sync="query.limit" @pagination="() => { this.$reload() }" />-->
  </div>
</template>

<script>
import { fetchStudentList } from '../../../api/student'
export default {
  name: 'TableSimple',
  props: {
    classid: {
      type: Number,
      default: -1
    }
  },
  data() {
    return {
      loading: true,
      total: 0,
      list: [],
      query: {
        page: 1,
        limit: 20,
        name: null,
        sort: '+id',
        classID: '-1'
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      this.query.classID = this.classid
      this.loading = true
      fetchStudentList(this.query).then(response => {
        if (response.data.total !== 0) {
          this.list = response.data.items
          this.total = response.data.total
        } else {
          this.list = []
          this.total = 0
        }
        this.loading = false
      }).catch(() => {
        this.loading = false
      })
    },
  }
}
</script>

<style scoped>

</style>
